import React from 'react';
import ReactDOM from 'react-dom/client';

function fetchTodos() {
    return [
        { id: 1, title: "吃饭", completed: false },
        { id: 2, title: "刷牙", completed: false },
        { id: 3, title: "喝水", completed: true },
        { id: 4, title: "洗澡", completed: true },
        { id: 5, title: "睡觉", completed: false },
    ];
}
function App() {
    const todos = fetchTodos();
    return (<>
        <ul>{
            todos.map((todo) => (
                <li key={todo.id}>
                    <input type='checkbox' defaultChecked={todo.completed} />
                    <label>{todo.title}</label>
                </li>
            ))
        }</ul></>);
}

// ReactDOM.createRoot(<App />, document.getElementById('root'));

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
    <App />
);

